<template>
  <div class="error-page-wrap">
    <div class="error-info-wrap">
      <img src="../../assets/images/error-404.png" alt="X">
      <p class="message-info">
        此页面不存在
      </p>
      <p class="message-text">
        请检查您输入的网址是否正确
      </p>
    </div>
  </div>
</template>

<script>
export default {
  name: 'Error404',
  data() {
    return {}
  }
}
</script>
<style lang="less" scoped>
.error-page-wrap {
  background: #f0f1f5;
  height: 100%;
  left: 0;
  position: fixed;
  top: 0;
  width: 100%;
  > .error-info-wrap {
    left: 58%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -55%);
    > p {
      text-align: center;
      &.message-info {
        font-size: 20px;
        color: #666;
      }
      &.message-text {
        font-size: 16px;
        color: #999;
      }
    }
  }
}
</style>
